import React, { Component } from 'react';
import DescriptionList from '@/components/DescriptionList';
import { Table, Card, Checkbox } from 'antd';

const { Description } = DescriptionList;
class ServiceInfor extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    const {
      form: { getFieldDecorator },
      serDto,
      id,
    } = this.props;
    const columns = [
      {
        title: '险种',
        dataIndex: 'assName',
      },
      {
        title: '缴费方式',
        dataIndex: 'payFlag',
      },
      {
        title: '缴费账户',
        dataIndex: 'accoName',
      },
      {
        title: '政策组合',
        dataIndex: 'grpName',
      },
    ];

    if (Number(serDto.useSerSetFlag) === 1) {
      return (
        <Card
          title={
            <p>
              <span style={{ fontWeight: 'bolder', marginRight: 32 }} id={id}>
                社保公积金信息
              </span>
              {getFieldDecorator('mobile', {
                rules: [{ required: false }],
                initialValue: true,
              })(<Checkbox>分险种维护参保类型</Checkbox>)}
            </p>
          }
          style={{ marginBottom: 24 }}
          bordered={false}
        />
      );
    }
    return (
      <div>
        <DescriptionList>
          <Description term="社保申报工资" />
          <Description term="公积金申报工资" />
          <Description term="缴费人员类别" />
          <Description term="社保参保类型" />
        </DescriptionList>
        <Table
          columns={columns}
          dataSource={serDto.detailSerDtos}
          rowKey={record => record.ass}
          size="small"
        />
      </div>
    );
  }
}

export default ServiceInfor;
